<template>
	<view class="wanl-order-list">
		<!-- <goods-tabs :list="navList1" :is-scroll="false" v-model="tabCurrentIndex" name="text"
			@change="tabClick"></goods-tabs> -->
		<view class="flex top">
			<view class="navBox" @click="tabClick(k)" v-for="(i,k) in navList" :key="k"
				:class="{'navBoxActive':tabCurrentIndex == k}">
				{{i.text}}
			</view>
		</view>
		<swiper class="swiperBox" :current="tabCurrentIndex" duration="300" @change="changeTab">
			<swiper-item class="tab-content" v-for="(tag, key) in navList" :key="tag.state">
				<scroll-view v-if="tag.loaded === true && tag.list.length !== 0" class="list-scroll-content" scroll-y
					@scrolltolower="loadData">
					<!-- 空白页 -->
					<!-- <wanl-empty text="没有找到任何优惠券" v-if="tag.loaded === true && tag.list.length === 0" /> -->
					<!-- 订单列表 -->
					<view v-for="(order, okey) in tag.list" :key="order.id" class="bcf radius-bock mt16 mb32">
						<view class="flex_start" @click="$wanlshop.to('/pages/shop/index?id='+ order.id)">
							<image class="br8" :src="$wanlshop.oss(order.avatar)" style="width: 90rpx;height: 90rpx;"
								mode=""></image>
							<view class="flex_ac flex1">
								<view class="f32 ml18 flex1 overflow_1">
									{{order.shopname}}
								</view>
								<view class="info ml12 f24">
									距离您 {{order.distance}}km
								</view>
							</view>

						</view>
						<scroll-view class="mt24" style="white-space: nowrap;width: 100%;" scroll-x="true">
							<view v-for="(order1, okey1) in order.coupons" :key="okey1" class="scroll-view-item_H"
								:class="{'scroll-view-item_H1':!okey1.receive}">
								<view class="content mt32">
									<view class="cff0">
									</view>
									<view class="cff0" v-if="order1.type_text == '满减券'">
										<text class="f24">￥</text>
										<text class="f40"> {{$wanlshop.formatNumberToWan(order1.price)}} </text>

									</view>
									<view class="cff0" v-if="order1.type_text == '折扣券'">
										<text class="f40">{{order1.discount}} </text>
										<text class="f24 ml8">折</text>
									</view>
									<view class="cff0" v-if="order1.type_text == '包邮券'">
										包邮
									</view>
									<view class="cde7 f16">
										满￥{{order1.limit}}可用
									</view>
									<view class="qxd" v-if="okey1.receive">
										去下单
									</view>
									<button class="lqxd" open-type="liveActivity"
										@click="changeReferenceCoupon(order1,okey1)">
										<!-- 领取下单 -->
									</button>
								</view>
							</view>
						</scroll-view>
					</view>
					<uni-load-more :status="tag.loadingType" :content-text="contentText" />
					<view class="edgeInsetBottom"></view>
				</scroll-view>
				<scroll-view class="list-scroll-content " scroll-y @scrolltolower="scrolltolower">
					<block v-if="tag.loaded === true && tag.list.length === 0 ">
						<view class="pr24 pl24" v-if="tag.is_give">

							<view class="toptitle mt24 c1a">
								<view class="f32">
									太棒了！您已领取全部优惠券！
								</view>
								<view class="info f24 mt24">
									在 <text class="error">“我的-优惠券” </text> 中查看
								</view>
								<view class="qsy" @click="$wanlshop.to('/pages/user/coupon/list')">
									去使用
								</view>
							</view>
						</view>
						<view class="pr24 pl24" v-if="!tag.is_give">
							<view class="toptitle mt24 c1a ">
								<view class="f32">
									商家还未发布优惠券，先去看看商品吧！
								</view>
								<view class="qsy" @click="$wanlshop.to('/pages/homeRecommend/classify/category')">
									去采购
								</view>
							</view>
						</view>
						<wanl-product :shopnameType="true" :dataList="likeData" />
					</block>
				</scroll-view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabCurrentIndex: 0,
				navList: [{ // 1=距离最近,2=销量最高,3=关注店铺
						state: 1,
						text: '距离最近',
						loadingType: 'more',
						current_page: 1,
						list: []
					},
					{
						state: 2,
						text: '销量最高',
						loadingType: 'more',
						current_page: 1,
						list: []
					},
					{
						state: 3,
						text: '关注店铺',
						loadingType: 'more',
						current_page: 1,
						list: []
					},

				],
				contentText: {
					contentdown: ' ',
					contentrefresh: '正在加载...',
					contentnomore: ''
				},
				triggered1: false,
				likeData: [],
				current_page: 1, //当前页码
				last_page: 1, //总页码
				status: 'loading',

			};
		},
		onShow() {
			this.getloadData()
		},
		onLoad(options) {
			this.loadlikeData();

		},
		methods: {
			scrolltolower() {
				if (this.current_page >= this.last_page) {
					this.status = 'noMore';
				} else {
					this.reload = false;
					this.current_page = this.current_page + 1; //页码+1
					this.status = 'loading';
					this.loadlikeData();
				}
			},
			// 滚动底部加载猜你喜欢
			loadlikeData() {
				this.$api.get({
					url: '/wanlshop/product/likes?pages=user',
					data: {
						page: this.current_page,
						limit: 10,
					},
					success: res => {
						this.likeData = this.reload ? res.data : this.likeData.concat(res
							.data); //评论数据 追加
						this.current_page = res.current_page; //当前页码
						this.last_page = res.last_page; //总页码
						this.status = res.total == 0 ? 'noMore' : 'more';
					}
				});
			},
			async changeReferenceCoupon(data, index) { //领取优惠券
				const shouldProceed = await this.$wanlshop.setrequestSubscribeMessage([
					'dozWmbG6aI3_ssongsC54RGl7JMVRTGhvGA4oHGiYoc',
					'wHXMJWpJlCdslyeWscQesvHcmNsLWKG5aQat5tw4MRA',
				])
				if (shouldProceed) {
					let _this = this
					this.$api.post({
						url: '/wanlshop/coupon/receive',
						data: {
							id: data.id
						},
						success: res => {
							uni.showModal({
								title: '领取成功',
								content: '去店铺下单？',
								success: function(res) {
									if (res.confirm) {
										_this.$wanlshop.to('/pages/shop/index?id=' + data
											.shop_id)
									} else if (res.cancel) {
										_this.$wanlshop.msg('领取成功')
										_this.getloadData()
									}
								}
							});

						}
					})
				}

			},
			getloadData() {
				if (this.triggered1 === false) {
					this.triggered1 = true
					let navItem = this.navList[this.tabCurrentIndex];
					navItem.current_page = 1
					navItem.loadingType = 'more'
					navItem.list = []
					setTimeout(() => {
						this.loadData()
						this.triggered1 = false
					}, 100)
				}
			},
			//获取订单列表
			loadData(source) {
				//这里是将订单挂载到tab列表下
				let index = this.tabCurrentIndex;
				let navItem = this.navList[index];
				let state = navItem.state;
				//判断是否最后一页
				if (navItem.loadingType == 'noMore') {
					return;
				}
				//tab切换只有第一次需要加载数据
				if (source === 'tabChange' && navItem.loaded === true) {
					return;
				}
				//防止重复加载
				if (navItem.loadingType === 'loading') {
					return;
				}
				navItem.loadingType = 'loading';
				// 获取列表
				this.$api.get({
					url: '/wanlshop/coupon/getShopCouponList',
					data: {
						type: state,
						page: navItem.current_page
					},
					success: res => {
						navItem.current_page = res.current_page; //当前页码
						if (res.last_page === res.current_page) {
							navItem.loadingType = 'noMore';
						} else {
							navItem.loadingType = 'more';
							navItem.current_page++;
						}
						navItem.is_give = res.is_give
						res.list.forEach(item => {
							navItem.list.push(item);
						});
						//loaded新字段用于表示数据加载完毕，如果为空可以显示空白页
						this.$set(navItem, 'loaded', true);
					}
				});
			},
			//swiper 切换
			changeTab(e) {
				this.tabCurrentIndex = e.target.current;
				this.getloadData()
			},
			//顶部tab点击
			tabClick(index) {
				this.tabCurrentIndex = index;
				this.getloadData()
			},
		},
		onShareAppMessage() {
			console.log(this.order_ids);
			if (this.order_ids && this.order_ids.length > 0) {
				console.log(this.order_ids);
				let _this = this
				this.getsharePay()
				return {
					title: '我选好材料啦，请你帮我付个款吧~',
					path: `/pages/user/money/paymentBehalf?order_ids=${this.order_ids.join(',')}`,
					imageUrl: 'https://img.aibbyp.com/wechatUser/xhcl.png', // 替换为实际分享图片URL
					success: (res) => {
						console.log('分享成功', res);
						_this.order_ids = []
						// 分享成功后的操作
					},
					fail: (err) => {
						_this.order_ids = []
						console.log('分享失败', err);
						// 分享失败后的操作
					}
				};
			}

		},
	};
</script>

<style lang="scss" scoped>
	.toptitle {
		background: #FFEFF1;
		padding: 52rpx 0 26rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		border-radius: 16rpx;
		height: 278rpx;
		justify-content: center;

		.qsy {
			background: #FF2C48;
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			padding: 12rpx 84rpx;
			font-size: 32rpx;
			color: #FFFFFF;
			margin-top: 30rpx;
		}
	}

	.wanl-order-list {
		height: 100vh;
		display: flex;
		flex-direction: column;
		// background: #fff;

		.swiperBox {
			flex: 1;
			overflow: hidden;
		}
	}

	.scroll-view-item_H {
		background-image: url('https://img.aibbyp.com/wechatUser/yhq1.png');
		background-size: 100% 100%;
		display: inline-block;
		width: 144rpx;
		height: 226rpx;
		margin-right: 36rpx;

		.cff0 {
			color: #FF001C;
		}

		.cde7 {
			color: #DE7B7B;
		}

		.lqxd::after {
			display: none;
		}

		.lqxd {
			margin-top: 40rpx;
			background-image: url('https://img.aibbyp.com/wechatUser/lqxd.png');
			background-size: 100% 100%;
			width: 108rpx;
			height: 44rpx;
		}

		.qxd {
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			border: 1rpx solid #FE344A;
			font-size: 20rpx;
			color: #FE344A;
			padding: 8rpx 24rpx;
			line-height: normal;
			margin-top: 40rpx;
		}

		.content {
			display: flex;
			flex-direction: column;
			align-items: center;
		}
	}

	.scroll-view-item_H1 {
		background-image: url('https://img.aibbyp.com/wechatUser/yhq2.png');

	}

	.top {
		background: #fff;
		padding: 24rpx 0 16rpx 12rpx;
	}

	.bcf {
		background-color: #fff;
		padding: 28rpx 30rpx;
	}

	.navBox {
		background: #EFEFEF;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
		font-size: 24rpx;
		color: #3D3D3D;
		padding: 8rpx 26rpx;
		margin-left: 28rpx;
	}

	.navBoxActive {
		background: #FF2C48;
		color: #fff;
	}

	.margin-lr-bj-xx {
		margin: 0 12rpx;
	}

	page {
		height: 100%;
	}
</style>